<template>
	<view>
		<view class="gui-list gui-margin-top gui-padding">
			<view class="gui-list-items">
				<view class="gui-list-image ucenter-face gui-relative">
					<image class="gui-list-image ucenter-face-image" 
					:src="headimg" mode="widthFix" ></image>
				</view>
				<view class="gui-list-body">
					<view class="gui-list-title">
						<text class="gui-list-title-text gui-primary-color">{{ nickName }}</text>
					</view>
					<text class="gui-list-body-desc gui-color-gray gui-block-text">欢迎使用西瓜打印</text>
				</view>
			</view>
		</view>
		<block v-if="isLogin">
			<view class="ucenter-line"></view>
			<view>
				<gui-box-banner :items="items"></gui-box-banner>
			</view>
			<view class="ucenter-line"></view>
			<view class="gui-list gui-margin-top gui-padding">
				<navigator  url="../order/order" open-type="switchTab">
				<view class="gui-list-items">
					<text class="gui-list-icon gui-icons gui-primary-color">&#xe624;</text>
					<view class="gui-list-body gui-border-b">
						<view class="gui-list-title">
							<text class="gui-list-title-text">我的订单</text>
						</view>
					</view>
					<text class="gui-list-arrow-right gui-icons">&#xe601;</text>
				</view>
				</navigator>
				<navigator url="../rechargeHistory/rechargeHistory">
				<view class="gui-list-items">
					<text class="gui-list-icon gui-icons gui-primary-color">&#xe612;</text>
					<view class="gui-list-body gui-border-b">
						<view class="gui-list-title">
							<text class="gui-list-title-text">充值记录</text>
						</view>
					</view>
					<text class="gui-list-arrow-right gui-icons">&#xe601;</text>
				</view>
				</navigator>
				<navigator url="../balanceList/balanceList">
				<view class="gui-list-items">
					<text class="gui-list-icon gui-icons gui-primary-color">&#xe64c;</text>
					<view class="gui-list-body gui-border-b">
						<view class="gui-list-title">
							<text class="gui-list-title-text">余额名细</text>
						</view>
					</view>
					<text class="gui-list-arrow-right gui-icons">&#xe601;</text>
				</view>
				</navigator>
				<navigator url="../address/address">
					<view class="gui-list-items">
						<text class="gui-list-icon gui-icons gui-primary-color">&#xe63f;</text>
						<view class="gui-list-body gui-border-b">
							<view class="gui-list-title">
								<text class="gui-list-title-text">收货地址</text>
							</view>
						</view>
						<text class="gui-list-arrow-right gui-icons">&#xe601;</text>
					</view>
				</navigator>
				<navigator url="../../job/job">
					<view class="gui-list-items">
						<text class="gui-list-icon gui-icons gui-primary-color">&#xe63f;</text>
						<view class="gui-list-body gui-border-b">
							<view class="gui-list-title">
								<text class="gui-list-title-text">任务中心</text>
							</view>
						</view>
						<text class="gui-list-arrow-right gui-icons">&#xe601;</text>
					</view>
				</navigator>
			</view>
		</block>
		<view class="ucenter-line"></view>
		<block v-if="!isLogin">
		<view hover-class="gui-tap" @tap="loginIn">
			<text class="gui-text-center gui-block-text gui-icons logoff gui-primary-color">&#xe62e; 立即登录</text>
		</view>
		</block>
		<block v-if="isLogin">
		<view hover-class="gui-tap" @tap="loginOut">
			<text class="gui-text-center gui-block-text gui-icons logoff gui-primary-color">&#xe62e; 退出登录</text>
		</view>
		</block>
	</view>
</template>
<script>
export default {
	data() {
		return {
			isLogin:false,
			headimg:'../../../static/headimg.png',
			nickName:'您好，请登录',
			items: [
				['0', '页', '余额']
			],
			navPath:'',
			navType:''
		}
	},
	onLoad:function(option){
		this.navPath = option.navPath;
		this.navType = option.navType;
		console.log(option);
	},
	onShow() {
		this.changePage();
	},
	methods: {
		loginIn:function(){
		let navPath = "/" + this.navPath
		let navType = this.navType	
		// 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
			wx.getUserProfile({
				lang:"zh_CN",
				desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
			}).then(
				res => {
					let userInfo = res.userInfo;
					wx.login({
						success:res=>{
							let region_province = userInfo.province;
							let region_city = userInfo.city;
							let nickname = userInfo.nickName;
							let headimg = userInfo.avatarUrl;
							let base_sex = userInfo.gender;
							console.log(userInfo)
							let code = res.code
							this.$http.request({
							    url: 'wxapp/session',
							    method: "POST", // POST、GET、PUT、DELETE、JSONP，具体说明查看官方文档
							    data: {
									code,
									nickname,
									base_sex,
									headimg,
									region_province,
									region_city
								}
							}).then(response=>{
								 // console.log(response);
							    //这里只会在接口是成功状态返回
								if(response.id >0 && response.status == 1){
									uni.setStorageSync("loginToken",response.token.token)
									uni.setStorageSync("loginTokenExpire",response.token.expire)
									uni.setStorageSync('isLogin',true)
									uni.setStorageSync('id',response.id)
									uni.setStorageSync('balance',response.balance_paper)
									uni.setStorageSync('nickName',nickname)
									uni.setStorageSync('avatarUrl',headimg)
									this.changePage();
								
									if(this.navPath&&this.navType){
										//如果navPath 不为空说明是从别的页面跳转过来的，需要跳回去

										switch(navType){
											case "switchTab": 
											uni.switchTab({
												url:navPath,
												fail: (err) => {
													console.log(err)
												}
											})
											break;
											default:
											uni.navigateTo({
												url:navPath,
												fail: (err) => {
													console.log(err)
												}
											})
										}
									}
								}else{
									uni.showToast({
										title:'用户不存在或者被冻结',
										icon:"none"
									})
								}
							}).catch(error=>{
							    //这里只会在接口是失败状态返回，不需要去处理错误提示
							    console.log(error);
							});
						}
					})
				}
			).catch(
				err =>{
					
				}
			)
		},
		loginOut:function(){
			uni.clearStorageSync();
			uni.setStorageSync('isLogin',false)
			this.isLogin = false;
			this.changePage()
		},
		changePage:function(){
			this.isLogin = uni.getStorageSync('isLogin')
			if(this.isLogin){
				this.headimg = uni.getStorageSync('avatarUrl')
				this.items =[
					[uni.getStorageSync('balance'), '页', '余额']
				]
				this.nickName = uni.getStorageSync('nickName')
				
			}else{
				this.headimg = '../../../static/headimg.png'
				this.nickName ='您好，请登录'
				this.items =[
					[0, '页', '余额']
				]
			}
		}
	}
}
</script>
<style>
.ucenter-face{width:100rpx; height:100rpx;}
.ucenter-face-image{width:100rpx; height:100rpx;}
.ucenter-line{height:20rpx; background-color:#F6F7F8; margin:16rpx 0;}
.logoff{line-height:88rpx; font-size:28rpx;}
.gui-list-title-text{line-height:60rpx;}
</style>